import { Component } from 'react'
import { View, Image } from '@tarojs/components'
import closeImg from '@/assets/close.png';
import './index.scss'

interface IProps {
    isOpened: boolean,
    onClose: Function,
    title: string,
}
export default class BottomPopup extends Component<IProps, {}> {
    constructor(props) {
        super(props);

        this.state = {
        };
    }

    handleClose() {
        const { onClose } = this.props
        if (onClose) { onClose() }
    }

    render() {
        const { isOpened, title } = this.props
        return (
            <View className={isOpened ? "floatlayout active" : "floatlayout"}>
                {/* <View className='floatlayout__overlay' onClick={this.handleClose.bind(this)}></View> */}
                <View className='floatlayout__container layout'>
                    <View className='layout-header  xmg-border-b'>
                        {title}
                        <Image src={closeImg} className='close-img' onClick={this.handleClose.bind(this)}/>
                    </View>
                    <View className='layout-body'>
                        {this.props.children}
                    </View>
                </View>
            </View>
        )
    }
}

